// 切换两个盒子
// 点击登录的盒子里面的a标签,让注册的盒子显示(注册的盒子显示了,就会把登录的盒子遮挡住)
$('.login a').on('click', function () {
  $('.register').show()
});

// 点击注册的盒子把登录的盒子遮挡住
$('.register a').on('click', function () {
  $('.register').hide()
})


// 登录功能
// 当表单提交的时候,阻止默认行为,收集账号和密码ajax提交到接口
$('.login form').on('submit', function (e) {
  e.preventDefault();
  let data = $(this).serialize();

  // ajax提交数据
  axios.post('/api/login', data).then(res => {
    let { status, message, token } = res.data;
    if (status === 0) {
      localStorage.setItem('token', token);
      // 提示一下
      layer.msg(message, { time: 1500 }, () => {
        // 跳转到 index.html
        location.href = './index.html';
      });
    }
  });
})

// 注册功能
// 当表单提交的时候,阻止默认行为,收集账号密码,ajax提交到接口
$('.register form').on('submit', function (e) {
  e.preventDefault();
  let data = $(this).serialize();
  axios.post('/api/reguser', data).then(res => {
    let { status, message } = res.data;
    if (status === 0) {
      layer.msg(message);
      $('.register form')[0].reset();
      $('.register').hide();
    }
  })
})

// 表单验证
let form = layui.form;
// console.log(form);
form.verify({
  // 键（验证规则）: 值（怎样验证）
  // len: ['正则表达式', '验证不通过时的提示'],
  len: [/^\S{6,12}$/, '长度6~12位且不能有空格'], // ^$一起用表示匹配整个字符串  \S表示非空白  {6,12} 不是 {6, 12}

  // 函数形式，函数的形参表示 使用该验证规则的输入框的值 。
  // 案例中，确认密码使用了这个验证规则，形参val表示我们输入的确认密码
  // same: function (val) { return '验证不通过时的提示' }
  same: function (val) {
    // 获取密码
    let pwd = $('.pwd').val();
    // 判断
    if (pwd !== val) return '两次密码不一致';
  }
});